{% extends "base.html" %}
    {% block body %}

	<!-- BEGIN PAGE LEVEL STYLES -->

	<link rel="stylesheet" type="text/css" href="/static/media/css/select2_metro.css" />

	<link rel="stylesheet" href="/static/media/css/DT_bootstrap.css" />

	<!-- END PAGE LEVEL STYLES -->

	<link rel="shortcut icon" href="/static/media/image/favicon.ico" />

    <div class="page-content">

			<!-- BEGIN SAMPLE PORTLET CONFIGURATION MODAL FORM-->

			<div id="portlet-config" class="modal hide">

				<div class="modal-header">

					<button data-dismiss="modal" class="close" type="button"></button>

					<h3>portlet Settings</h3>

				</div>

				<div class="modal-body">

					<p>Here will be a configuration form</p>

				</div>

			</div>

			<!-- END SAMPLE PORTLET CONFIGURATION MODAL FORM-->

			<!-- BEGIN PAGE CONTAINER-->

			<div class="container-fluid">

				<!-- BEGIN PAGE HEADER-->

				<div class="row-fluid">

					<div class="span12">


						<!-- BEGIN PAGE TITLE & BREADCRUMB-->

						<h3 class="page-title">

							栏目管理 <small>managed table samples</small>

						</h3>

						<ul class="breadcrumb">

							<li>

								<i class="icon-home"></i>

								<a href="index.html">主页</a>

								<i class="icon-angle-right"></i>

							</li>

							<li>

								<a href="#">栏目管理</a>

								<i class="icon-angle-right"></i>

							</li>

							<li><a href="#">栏目列表</a></li>

						</ul>

						<!-- END PAGE TITLE & BREADCRUMB-->

					</div>

				</div>

				<!-- END PAGE HEADER-->

				<!-- BEGIN PAGE CONTENT-->

				<div class="row-fluid">

					<div class="span12">

						<!-- BEGIN EXAMPLE TABLE PORTLET-->

						<div class="portlet box light-grey">

							<div class="portlet-title">

								<div class="caption"><i class="icon-globe"></i>栏目管理</div>

								<div class="tools">

									<a href="javascript:;" class="collapse"></a>

									<a href="#portlet-config" data-toggle="modal" class="config"></a>

									<a href="javascript:;" class="reload"></a>

									<a href="javascript:;" class="remove"></a>

								</div>

							</div>

							<div class="portlet-body">

								<div class="clearfix">

									<div class="btn-group">
										<a id="sample_editable_1_new" href="#myModal1" role="button" class="btn green" data-toggle="modal">
											添加分类
										</a>
										<i class="icon-plus"></i>
									</div>

									<div class="btn-group pull-right">

										<button class="btn dropdown-toggle" data-toggle="dropdown">工具 <i class="icon-angle-down"></i>

										</button>

										<ul class="dropdown-menu pull-right">

											<li><a href="#">打印</a></li>

											<li><a href="#">保存为PDF</a></li>

											<li><a href="#">导出为Excel</a></li>

										</ul>

									</div>

								</div>

								<table class="table table-striped table-bordered table-hover" id="sample_1">

									<thead>

										<tr>

											<th style="width:8px;"><input type="checkbox" class="group-checkable" data-set="#sample_1 .checkboxes" /></th>

											<th>栏目名称</th>

											<th class="hidden-480">父类</th>

											<th class="hidden-480">时间</th>

											<th >操作</th>

										</tr>

									</thead>

									<tbody>
										{% for item in cateloglist %}
										<tr class="odd gradeX">

											<td><input type="checkbox" class="checkboxes" value="1" /></td>

											<td>{{item['name']}}</td>

											<td class="hidden-480">{{item['parent']}}</td>

											<td class="center hidden-480">{{item['create']}}</td>

											<td ><span class="label label-success">操作</span></td>

										</tr>

										{% end %}
									</tbody>

								</table>

							</div>

						</div>

						<!-- END EXAMPLE TABLE PORTLET-->

					</div>

				</div>



				<!-- END PAGE CONTENT-->

			</div>

			<!-- END PAGE CONTAINER-->

		</div>


<div class="container">

	<div id="myModal1" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">

		<div class="modal-header">
			<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
			<h3 id="myModalLabel1">添加新分类</h3>
		</div>
		<form id="addItemForm">
		<div class="modal-body">
			<input type="text" name="catelog" id="catelog" value="">
			{%module xsrf_form_html() %}

			<span id="tipMsg"></span>
		</div>

		<div class="modal-footer">
			<button class="btn" data-dismiss="modal" aria-hidden="true" id="Close">关闭</button>
			<button class="btn yellow" type="submit">保存</button>
		</div>
		</form>

	</div>

</div>





<script type="text/javascript">


function test(key){
	$("#protect_type").val(key)
	// alert($("#protect_type").val())
	$(".Astack2").click()
}



$('#addItemForm').submit(SubMitAjax)

function SubMitAjax(){
		$.ajax({
			type : "POST",  //提交方式
			dataType : "json",
			url : "/admin/catelog",//路径
			data : {
				"catelog":$('#catelog').val(),
				"_xsrf": $("input[name='_xsrf']").val(),
			 },
			success : successFUNC,
			error : errorFUNC
		});
		return false
}

function successFUNC(result) {
	if ( result.code == 200 ){
	 	$("#tipMsg").html("<font color='red'>添加保护期成功</font>");
	 	var str = ''
	 	setTimeout('$("#Close").click();$("#tipMsg").html("");$("#duration").val("");$("#start_time").val("")', 1000);
	}else{
		$("#tipMsg").html("<font color='red'>"+result.message+"</font>");
	}

}

function errorFUNC(XMLHttpRequest, textStatus, errorThrown){
	alert(textStatus)
}

</script>








	<!-- BEGIN PAGE LEVEL PLUGINS -->

	<script type="text/javascript" src="/static/media/js/select2.min.js"></script>

	<script type="text/javascript" src="/static/media/js/jquery.dataTables.js"></script>

	<script type="text/javascript" src="/static/media/js/DT_bootstrap.js"></script>

	<!-- END PAGE LEVEL PLUGINS -->

	<!-- BEGIN PAGE LEVEL SCRIPTS -->

	<script src="/static/media/js/table-managed.js"></script>

	<script>

		jQuery(document).ready(function() {

//		   App.init();

		   TableManaged.init();

		});

	</script>

    {% end %}
